$(function(){
	
	
	$("#btn").click(function(e){
		//阻止页面默认行为在此处即为阻止form表单提交刷新页面
		e.preventDefault();
		var localHistory = window.localStorage.getItem("searchHis");
		//判断input输入框有无内容
		if( $("#ipt").val()=="" ){
			layer.alert("请输入搜索内容!");
		}else{
			//判断有没有存储搜索历史的本地存储变量
			if( localHistory==null ){
				window.localStorage.setItem("searchHis",$("#ipt").val());			
			}else{
				//把localHistory变成一个数组
				//console.log(localHistory);
				localHistory = localHistory.split(",");
				//console.log(localHistory);
				//在localHistoryfang数组末尾添加搜索内容
				localHistory.push( $("#ipt").val() );
				//console.log(localHistory);
				//把localHistory变成一个字符串
				localHistory = localHistory.join();
				console.log(localHistory);
				window.localStorage.setItem("searchHis",localHistory);			
			}
			//跳转页面（根据后台数据此处无意义）
			//window.location.href="pro_list.html";
		}
	})
	
	
	$("#ipt").focus(function(){
		var localHistory = window.localStorage.getItem("searchHis");
		//判断本地存储是否有数据
		if(localHistory!=null || localHistory!=undefined){
			$(".history").show();
			$(".history ul").empty();
			//把localHistory变成一个数组
			localHistory = localHistory.split(",");
			//颠倒数组中元素的顺序
			localHistory = localHistory.reverse();
			//console.log(localHistory);
			for(var i=0;i<localHistory.length;i++){
				var li = "<li><span class='text'>"+localHistory[i]+"</span><span class='del'>删除</span></li>"
				//console.log(li)
				$(".history ul").append(li);
			}
			
			//绑定动态生成的事件，要封装一个函数
			$(".history ul li .text").on("click",hisHerf);//点击历史纪录条转页面
			$(".history ul li .del").on("click",delHistory);//点击历史纪录条转页面
		}
	})
	
	//封装点击历史纪录条转页面
	function hisHerf(){
		window.location.href="pro_list.html";
	}
	//封装点击删除
	function delHistory(){
		var localHistory = window.localStorage.getItem("searchHis");
		//把localHistory变成一个数组
		localHistory = localHistory.split(",");
		var index = localHistory.indexOf( $(this).prev().html() );
		//console.log(index)
		localHistory.splice(index,1);
		//console.log(localHistory);
		//把localHistory变成一个字符串
		localHistory.join();
		window.localStorage.setItem("searchHis",localHistory);
		$(this).parent().remove();
		if(localHistory.length==0){
			$(".history").hide();
			window.localStorage.removeItem("searchHis");
		}
	}
	
	$(document).click(function(e){
		if($(e.target).closest(".search").length==0  ){
			$(".history").hide();
		}
	})
	
	
})
